<template>
	<view class="bannerBox" @click="toNext">
		<image :src="data.image" lazy-load="true" ></image>
		<text>{{data.title}}</text>
	</view>
</template>

<script setup>
	import {
		ref,
		reactive,
		defineProps
	} from 'vue';

	// defineProps(['image', 'title','path'])
	const props = defineProps({
		data: {
			type: Object,
			default: () => {}
		}
	})

	const toNext = (() => {
		uni.navigateTo({
			url: props.data.path
		})
	})
</script>

<style lang="less">
	.bannerBox {
		width: 100%;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		font-size: 26rpx;

		img,
		image {
			width: 80rpx;
			height: 80rpx;
			border-radius: 50%;
			margin-bottom: 10rpx;
		}

	}
</style>